@mixin overlay-panel-box() {
  box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
  border-radius: 15px;
}

.mat-mdc-menu-panel.mat-mdc-elevation-specific {
  @apply border border-solid border-neutral-200 dark:border-neutral-600;
}

.mat-mdc-menu-panel.mat-elevation-z4 {
  @include overlay-panel-box();
}
.mat-mdc-menu-panel.mat-elevation-z5 {
  @apply rounded-xl shadow-md dark:shadow-neutral-800;
}

.mat-mdc-menu-panel.mat-elevation-z6,
.mat-mdc-menu-panel.mat-mdc-elevation-specific.mat-elevation-z8 {
  @apply rounded-xl shadow-md dark:shadow-neutral-800;
}

.mat-mdc-menu-panel.mat-mdc-elevation-specific.mat-elevation-z9 {
  @apply rounded-2xl shadow-lg dark:shadow-neutral-800;
}

.mat-mdc-select-panel:not([class*='mat-elevation-z']) {
  @include overlay-panel-box();

  .mat-mdc-option.ngm-appearance-dashed:first-child {
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
  }
  .mat-mdc-option.ngm-appearance-dashed:last-child {
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
  }
}

.mat-mdc-autocomplete-panel:not([class*='mat-elevation-z']) {
  box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
  border-bottom-left-radius: 15px;
  border-bottom-right-radius: 15px;
}

/* for dialog container */
.cdk-overlay-pane.mat-mdc-dialog-panel.large {
  --mat-dialog-container-min-width: 80vw;
  min-height: 80vh;
}
.cdk-overlay-pane.mat-mdc-dialog-panel.medium {
  --mat-dialog-container-min-width: 60vw;
  min-height: 60vh;
}
.cdk-overlay-pane.mat-mdc-dialog-panel.small {
  --mat-dialog-container-min-width: 40vw;
  min-height: 40vh;
}

.mat-mdc-autocomplete-panel {
  .mdc-list-item__primary-text {
    width: 100%;
  }
}